<#import "../tpl/pageTep.ftl" as page>
<@page.pageBase currentMenu="线下订单">
<style>
  .form-horizontal .controls {
    line-height: 40px;
    height: 40px;
  }

  .button-primary, .button-danger {
    margin-left: 5px;
  }

  .form-horizontal .time-label {
    width: 70px;
    line-height: 40px;
    margin-left: 20px;
  }

  .form-horizontal .time-controls {
    margin-left: 5px;
  }

  .form-horizontal .money-label {
    width: 60px;
    line-height: 40px;
    margin-left: 5px;
  }

  #title {
    width: 183px;
    margin-left: -23px;
  }
    .mr0{
        margin: 0 !important;
    }
</style>
<!--suppress ALL -->
<form id="searchForm" class="form-panel" action="${basepath}/rest/manage/order/selectOrderPage">
  <ul class="panel-content">
    <li>
      <div class="control-group span5">
        <div class="search-controls  controls">
          <input type="text" name="userName" id="userName" value="" placeholder="搜索订单号、买家账户等">
        </div>
      </div>
      <div>
        <label class="time-label control-label">订单状态：</label>
        <div class="time-controls controls">
          <select name="status" class="input-normal" id="status">
            <option value="">全部</option>
            <option value="init">待付款</option>
            <option value="pass">待发货</option>
            <option value="send">待收货</option>
            <option value="finish">已完成</option>
            <option value="cancel">已关闭</option>
          </select>
        </div>
        <label class="time-label control-label">起始日期：</label>

        <div class="time-controls controls">
          <input name="startDate" class="input-small calendar" type="text" style="width: 80px;"><label>
          &nbsp;-&nbsp;</label><input
          name="endDate" class="input-small calendar" type="text" style="width: 80px;">
        </div>

        <button type="submit" class="button  button-primary">
          查询
        </button>
        <a class="button button-danger" href="javascript:delFunction()">
          批量删除
        </a>
      </div>
    </li>

  </ul>
</form>
<div id="grid"></div>
<#-------------------------------------------------------绑定桌号 begin-------------------------------------------------------->
<div id="addContent" style="display:none;" >
  <form id="addForm" class="form-horizontal" action="${basepath}/rest/manage/order/bindSeat" method="post">
    <input type="hidden" class="input-normal control-text idBtn" name="id" />
    <div class="row">
      <div class="control-group span16">
        <label class="control-label">桌位类型：</label>
        <div class="controls mr0" style="line-height: normal">
          <select data-rules="{required:true}" class="typeBtn" >
            <option value="">-请选择桌位类型-</option>
            <option value="big">大桌</option>
            <option value="middle">中桌</option>
            <option value="small">小桌</option>
          </select>
        </div>
      </div>
        <div class="control-group span16 " style="margin-bottom: 20px">
            <label class="control-label">桌位编号：</label>
            <select  class="number" data-rules="{required : true}" name="seatNumber">
            </select>
        </div>

    </div>
  </form>
</div>
<#-------------------------------------------------------绑定桌号 end-------------------------------------------------------->
<script>
  var Select = BUI.Select;
  var Grid = BUI.Grid,
    Store = BUI.Data.Store,
    columns = [
      {title: '消费店铺', dataIndex: 'storeName', elCls: 'center', width: '20%'},
      {title: '下单时间', dataIndex: 'createTime', elCls: 'center', width: '15%'},
      {title: '订单号', dataIndex: 'orderID', elCls: 'center', width: '10%'},
      {title: '用户名称', dataIndex: 'userName', elCls: 'center', width: '15%'},
      {
        title: '排队号', dataIndex: 'lineUpNumber', elCls: 'center', width: '15%', renderer: function (value) {
          return value == '' || value== null ? '—— ': value;

        }
      },
      {
        title: '绑定桌号', dataIndex: 'seatAmount', elCls: 'center', width: '15%', renderer: function (value,data) {
          return value==null? '<a href="javascript:bind('+data.storeID+','+data.id+')">未绑定</a>': '<a href="javascript:unBind('+data.id+','+data.seatNumber+')">'+value+'</a>';
        }
      },
      {
        title: '订单状态', dataIndex: 'status', elCls: 'center', width: '10%', renderer: function (value) {
          switch (value) {
            case 'init':
              return '<p>待付款</p>';
            case 'pass':
              return '<p>待发货</p>';
            case 'send':
              return '<p>待收货</p>';
            case 'finish':
              return '<p>已完成</p>';
            default :
              return '<p>已关闭</p>';
          }
        }
      },
      {
        title: '操作',
        dataIndex: 'orderID',
        elCls: 'center',
        width: '10%',
        renderer: function (value, data) {
          var option1 = '<a href="${basepath}/rest/manage/order/toEdit?id=' + value + '">查看</a>';
          var option2 = '<a href="javascript:deleteOne(' + data.id + ')">删除</a>';
          return option1 + "&nbsp;&nbsp;&nbsp;&nbsp;" + option2;
        }
      }
    ];
  //分页查询
  var store = new Store({
              url : '/rest/manage/order/selectOrderPage',
              autoLoad:true, //自动加载数据
              params : { //配置初始请求的参数
                  length : '10',
                  type: 'in'
              },
              pageSize:10,	// 配置分页数目
              root : 'list',
              totalProperty : 'total'
          }),
    grid = new Grid.Grid({
      render: '#grid',
      columns: columns,
      width: '100%',
      loadMask: true, //加载数据时显示屏蔽层
      store: store,
      plugins: [Grid.Plugins.CheckSelection], // 插件形式引入多选表格
      // 底部工具栏
      bbar: {
        pagingBar: true
      }
    });
  grid.render();
  //查询框
  var form = new BUI.Form.HForm({
    srcNode: '#searchForm'
  }).render();

  form.on('beforesubmit', function (ev) {
    var obj = form.serializeToObject();
    obj.start = 0; //返回第一页
    store.load(obj);
    return false;
  });

  //删除选中的记录
  function delFunction() {
    BUI.Message.Confirm('确认要删除吗？', function () {
      var selections = grid.getSelection();
      var ids = new Array();
      for (var i = 0; i < selections.length; i++) {
        ids[i] = selections[i].id.toString();
      }
      $.ajax({
        type: "POST",
        url: "${basepath}/rest/manage/order/deletesOrderDetail",
        dataType: "json",
        data: {
          ids: ids
        },
        success: function (data) {
          var obj = new Object();
          obj.start = 0; //返回第一页
          store.load(obj);
        }
      });
    }, 'question');
  }

  //删除单个订单记录
  function deleteOne(id) {
    BUI.Message.Confirm('确认要删除吗？', function () {
      $.ajax({
        type: "POST",
        url: "${basepath}/rest/manage/order/delete",
        dataType: "json",
        data: {
          id: id
        },
        success: function (data) {
          var obj = new Object();
          obj.start = 0; //返回第一页
          store.load(obj);
        }
      });
    }, 'question');
  }

  var addForm = new BUI.Form.Form({
    srcNode: '#addForm',
    submitType: 'ajax',
    callback: function (data) {
      var obj = new Object();
      obj.start = 0; //返回第一页
      store.load(obj);
      addDialog.close();
    }
  });
  addForm.render();
  var addDialog = new BUI.Overlay.Dialog({
    title: '绑定桌位',
    width: 400,
    contentId: 'addContent',
    success: function () {
      if (addForm.isValid()) {
        addForm.ajaxSubmit();
      } else {
        addForm.valid();
      }
    }
  });
  //绑定桌号
  function bind(storeID,orderID) {
    addForm.clearFields();
    addForm.clearErrors();
    addDialog.show();
    $(".idBtn").val(orderID);
    //获取二级下拉数据源
      $(".typeBtn").on('change', function () {
          $.ajax({
              type: 'GET',
              url:'/rest/manage/seat/selectAllList?storeID='+storeID+'&status=unBind',
              data:{type:$(this).val()},
              dataType: 'json',
              success:function (data) {
                  var list=data.data,html='';
                  $.each(list,function (i, e) {
                      html+='<option value="'+e.id+'" >'+e.number+'</option>';
                  });
                  $('.number').html(html)
              }
          })
      });
  }
  //解绑座位
  function unBind(id,value) {
    BUI.Message.Confirm('确定要解绑该帐号信息？', function () {
      $.ajax({
        type: 'POST',
        url: '${basepath}/rest/manage/order/unBindSeat',
        dataType: 'json',
        data: {
          id: id,
          seatNumber: value
        },
        success: function () {
        window.location.reload()
        }
      }, 'question');
    })
  }
</script>

</@page.pageBase>
